﻿<!DOCTYPE HTML>
<html xmlns:th="http://www.thymeleaf.org"
	xmlns:layout="http://www.ultraq.net.nz/web/thymeleaf/layout" layout:decorator="partial/layoutAdmin">
<head>
<title>文章管理</title>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style type="text/css">
.title-prompt {
	position: absolute;
	right: 0px;
	font-size: 12px;
	top: 10px;
}

.createPost-container {
	position: relative;
}

.createPost-main-container {
	padding: 10px;	
}

.avatar-uploader .el-upload {
	border: 1px dashed #d9d9d9;
	border-radius: 6px;
	cursor: pointer;
	position: relative;
	overflow: hidden;
}

.avatar-uploader .el-upload:hover {
	border-color: #409EFF;
}

.avatar-uploader-icon {
	font-size: 28px;
	color: #8c939d;
	width: 270px;
	height: 178px;
	line-height: 178px;
	text-align: center;
}

.avatar {
	width: 270px;
	height: 178px;
	display: block;
}

.el-upload--picture-card {
	background-color: #fbfdff;
	border: 1px dashed #c0ccda;
	border-radius: 6px;
	box-sizing: border-box;
	margin: 0 8px 8px 0;
	width: 270px;
	height: 148px;
	line-height: 146px;
	vertical-align: top;
}

.el-upload-list--picture-card .el-upload-list__item {
	overflow: hidden;
	background-color: #fff;
	border: 1px solid #c0ccda;
	border-radius: 6px;
	box-sizing: border-box;
	width: 270px;
	height: 148px;
	margin: 0 8px 8px 0;
	display: inline-block;
}

.el-radio {
	color: #606266;
	font-weight: 500;
	line-height: 1;
	cursor: pointer;
	white-space: nowrap;
	outline: 0;
	width: 15%;
}

div#mceu_55 {
	left: 0 !important;
	width: 99% !important;
}

.mind-top {
	position: fixed;
	/*固定定位*/
	width: 100%;
	line-height: 70px;
	height: 70px;
	padding: 0 22px;
	background: "#fff";
	border-bottom: '1px solid #676a6c'
}
.s-choose-wrap{
    position: absolute;
    right: 16px;
    top: -5px;
    z-index: 20;
    bottom: 0;
    width: 0px;
    transition: .3s;
}
.s-choose-btn {
    position: absolute;
    top: 6px;
    left: -16px;
    width: 32px;
    height: 120px;
    text-align: center;
    background: #ebf7ff;
    border: 2px solid #fff;
    border-radius: 6px 0 0 6px;
    box-shadow: 0 0 7px rgba(94,39,60,.35);
}
.s-choose-btn span {
    width: 1em;
    display: inline-block;
    line-height: 1.3;
}
.s-c-i {
    display: block;
    width: 24px;
    height: 24px;
    line-height: 25px;
    margin: 10px auto 5px;
    text-align: center;
    color: #fff;
    background: #156498;
    border-radius: 50%;
}
.s-c-i-b {
    display: block;
    width: 24px;
    height: 24px;
    line-height: 25px;
    margin: 10px auto 5px;
    text-align: center;
    color: #fff;
    border-radius: 50%;
}
.s-choose-box {
    box-sizing: border-box;
    height: 100%;
    text-align: left;
    background: rgba(255,255,255,.9);
    box-shadow: 0 0 7px 2px rgba(145,172,189,.35);
}
.w-show {
    width: 560px;
    right:0;
}
.c-l-w {
    left: -30px !important;
}
.toolbars{
	position: fixed;
	top: 0;
	right: 0;
	height: 100%;
	width: 6px;
	background-color: #7a6e6e;
}
.toolbars ul{
  	position:absolute;
  	top: 50%;
  	right: 0;
  	transform: translate(0,-40%);
  	z-index: 3;
}
.toolbars ul li{
	width: 32px;
	height: 120px;
	margin-bottom: 2px;
/* 	background-color: #7A6E6E; */
	position: relative;
	list-style: none;
}
.toolbars ul li span{
	width: 1em;
    display: inline-block;
    line-height: 1.3;
}
.toolbars ul li a{
    position: absolute;
	text-align: center;
    width: 32px;
    height: 120px;
    text-align: center;
    color:#fff;
    border: 1px solid #fff;
    border-radius: 6px 0 0 6px;
    box-shadow: 0 0 7px rgba(94,39,60,1);
}
.blue{
 	background: #409eff;
}
.green{
 	background: #67c23a;
}
</style>
<link th:href="@{/editor/css/editormd.css}" rel="stylesheet" />
</head>
<body>
	<div layout:fragment="content">
		<div class="createPost-container">
			<el-form class="form-container" :model="submitForm" :rules="rules" ref="submitForm">
			<div class="createPost-main-container">
				<div :class="[saveoptionshow ? 'w-show' : '', 's-choose-wrap']">
					<a href="javascript:void(0)" :class="[saveoptionshow ? 'c-l-w' : '', 's-choose-btn']" class="" @click="btnsaveoption">
						<i class="el-icon-menu s-c-i"></i> 
						<span>发布选项</span>
					</a>
					<el-scrollbar class="s-choose-box">
						<el-card class="box-card" style="margin-left:20px;">
				    		<div class="block">
								<el-form-item style="" prop="title" label-width="45px" label="标题:">
								<el-input type="textarea" class="article-textarea" :rows="1" placeholder="请输入 标题"
									v-model="submitForm.title" required :maxlength="100" clearable> </el-input> </el-form-item>
								<el-form-item style="" label-width="45px" label="摘要:"> <el-input
									type="textarea" class="article-textarea" :rows="2"  placeholder="请输入内容"
									v-model="submitForm.abstractContent"> </el-input> 
								</el-form-item>
								<el-form-item label="分类"> 
									<el-select v-model="submitForm.categoryName" @change="cateCheckChange" filterable placeholder="请选择"> 
										<el-option v-for="item in categoryOptions" :key="item.id" :label="item.name" :value="item.id"></el-option> 
									</el-select> 
								</el-form-item>
								<el-form-item label="日期" > <el-date-picker v-model="submitForm.publishTime"
									type="datetime" format="yyyy-MM-dd HH:mm:ss" placeholder="选择发布时间" style="max-width:200px">
								</el-date-picker> 
								</el-form-item>
								<el-form-item label="作者">
								  <el-input placeholder="请输入 作者" v-model="submitForm.author" required  :maxlength="100" clearable style="max-width:200px" > </el-input>
								  </el-form-item>
								<el-form-item  prop="title" label-width="90px" label="能否评论:">
								<el-radio-group  v-model="submitForm.openComment"> 
									<el-radio :label="0" style="width:60px">关闭</el-radio> 
									<el-radio :label="1" style="width:60px">打开</el-radio> 
								</el-radio-group> 
							</el-form-item>
							<el-form-item prop="title" label-width="90px" label="是否推荐:">
								<el-radio-group  v-model="submitForm.isRecommend"> 
									<el-radio :label="0" style="width:60px">最新发布</el-radio> 
									<el-radio :label="1" style="width:60px">特别推荐</el-radio> 
								</el-radio-group> 
							</el-form-item>
							</div>
						</el-card> 
						<el-card class="box-card" style="margin-left:20px">
							<div slot="header" class="clearfix">
								<i class="el-icon-edit"></i><span>选择标签</span>
							</div>
							<el-autocomplete class="inline-input" v-model="defaultTag" :fetch-suggestions="querySearch"
								clearable="true" placeholder="请输入内容" @select="selectTag"> </el-autocomplete> <el-button
								v-loading="loading" style="margin-left: 10px;" type="success" @click="addTag">新建 </el-button>
							<div style="margin-top: 10px">
								<el-tag v-for="tag in selectedTags" :key="tag.name" style="margin:5px"
									closable @close="removeTag(tag)" :type="tag.type"> {{tag.name}} </el-tag>
							</div>
						</el-card> 

						<el-card class="box-card" style="margin-left:20px">
							<div slot="header" class="clearfix">
								<i class="el-icon-upload"></i><span>添加封面</span>
							</div>
							<div style="margin: 20px 0">
								<el-radio-group v-model="submitForm.showStyle">
									<el-radio :label="0">无图</el-radio>
									<el-radio :label="1">单图</el-radio>
									<el-radio :label="2">多图</el-radio>
									<el-radio :label="3">大图</el-radio>
								</el-radio-group>
							</div>
							<el-tabs v-model="coverImageActive" type="card">
								<el-tab-pane label="本地上传" name="first">
									<el-upload title="选择图片"
											   :headers="headers"
											   action="/qiniu/upload"
											   multiple
											   :show-file-list="showfileList"
											   :on-success="uploadCoverImage"
											   :before-upload="validCoverImageUpload"
											   :limit="limit"
											   list-type="picture-card">
										<i class="el-icon-plus"></i>
									</el-upload>
								</el-tab-pane>
								<el-tab-pane label="网络地址" name="second">
									<div style="margin: 20px 0">
										<el-input  style="width: 60%"></el-input>
										<el-button v-loading="loading" style="margin-left: 10px;" v-model="netimageurl" type="success" @click="addnetimage">添加网络图片 </el-button>
									</div>
								</el-tab-pane>
							</el-tabs>
							<ul class="el-upload-list el-upload-list--picture-card">
								<li v-for="item in submitForm.coverImageList" class="el-upload-list__item is-success">
									<img :src="item" alt="" class="el-upload-list__item-thumbnail">
									<label class="el-upload-list__item-status-label">
										<i class="el-icon-upload-success el-icon-check"></i>
									</label>
									<i class="el-icon-close" @click="handleRemove"></i>
									<span class="el-upload-list__item-actions">
										<span class="el-upload-list__item-preview">
											<i class="el-icon-zoom-in" @click="handlePictureCardPreview(item.coverImage)"></i>
										</span>
										<span class="el-upload-list__item-delete">
											<i class="el-icon-delete" @click="handleRemove(item.coverImage)"></i>
										</span>
									</span>
								</li>
							</ul>
						   <el-dialog :visible.sync="dialogVisible">
							   <img width="100%" :src="dialogImageUrl">
						   </el-dialog>
						</el-card>
					<div class="toolbars" v-show="saveoptionshow">
					<ul>
						<li>
							<a href="javascript:void(0)"  class="blue" @click="submitArticle(0)">
								<i class="el-icon-menu s-c-i-b"></i> 
								<span>保存</span>
							</a>
						</li>
						<li>
							<a href="javascript:void(0)"  class="green" @click="submitArticle(1)">
								<i class="el-icon-menu s-c-i-b"></i> 
								<span>发布</span>
							</a>
						</li>
					</ul>
					</div>
					</el-scrollbar>
				</div>
				<div id="test-editormd"></div>
			</div>
			</el-form>
		</div>
	</div>
	<div layout:fragment="jscontent">
		<script th:src="@{/editor/js/editormd.js}"></script>
		<script th:inline="javascript" type="text/javascript">
		var testEditor;
		var initArticleModel=function(){
			var articleModel=[[${articleModel}]];
			if(articleModel!=null){
				this.submitForm.status=articleModel.status;
				this.submitForm.title=articleModel.title;
				this.submitForm.author=articleModel.author;
				this.submitForm.content=articleModel.content;
				this.submitForm.abstractContent=articleModel.abstractContent;
				if(articleModel.coverImageList.length>0){
				    for(var i=0;i<articleModel.coverImageList.length;i++){
                        this.submitForm.coverImageList.push(articleModel.coverImageList[i].coverImage);
					}
				}
				this.submitForm.publishTime=articleModel.publishTime;
				this.submitForm.id=articleModel.id;
				this.submitForm.showStyle=articleModel.showStyle;
				this.submitForm.articleType=articleModel.articleType;
				this.submitForm.categoryId=articleModel.categoryId;
				this.submitForm.categoryName=articleModel.category.categoryName;
				this.submitForm.openComment=articleModel.openComment;
				this.submitForm.articleTags=articleModel.articleTags;
				this.submitForm.isRecommend=articleModel.isRecommend;
                this.initArticleTags(articleModel.articleTags);
			}
		}
		var returnArticle=function(){
			window.location.href='/article'
		}
		var submitArticle=function(status){
			var _this=this;
			_this.submitForm.status=status;
			_this.submitForm.editorType=0;
			_this.submitForm.publishTime=moment(_this.submitForm.publishTime).format("YYYY-MM-DD HH:mm:ss")
			_this.submitForm.content=testEditor.getMarkdown();
			var param=_this.submitForm;
			$.ajax({
		        data: param,
		        type: "POST",
		        url: '/article/saveArticle',
		        traditional:true, 
		        success: function (result) {
					if(result.code==0){
						_this.$message({
							  showClose: true,
							  duration:0,
							  onClose:function(){
								  _this.returnArticle();
							  },
					          message: result.msg,
					          type: 'success'
					        });
                        _this.returnArticle();
					}else{
						_this.$message.error(result.msg);
					}
		        },
		        error: function (data) {}
		    });
			
		}
		var loadNode=function(node, resolve){
			var _this=this;
			_this.parentId=node==undefined?0:node.id
			$.ajax({
		        data: {parentId:_this.parentId},
		        type: "POST",
		        url: '/getCategorylist',
		        success: function (result) {
					if(result.code==0){
						 resolve(result.data);
						 _this.parentId=0;
					}else{
						_this.$message.error(result.msg);
					}
		        },
		        error: function (data) {}
		    });
		} 
		var loadCategoryOptions=function(){
			var _this=this;
			$.ajax({
		        data: {parentId:0},
		        type: "POST",
		        url: '/getCategorylist',
		        success: function (result) {
					if(result.code==0){
						_this.categoryOptions=result.data;
					}else{
						_this.$message.error(result.msg);
					}
		        },
		        error: function (data) {}
		    });
		} 
		var loadAllTagList=function(){
			var _this=this;
			axios.post('/getTaglist', {parentId:_this.parentId})
			.then(function (response) {
				var result=response.data;
				if(result.code==0){
					_this.tagList=result.data;
				}
			})
			.catch(function (error) {
			 	console.log(error);
			});
			
		}
        var initArticleTags=function(value){
            var _this=this;
            var param={tagIds:value}
            $.ajax({
                data: param,
                type: "POST",
                url: '/getTagByIds',
                traditional:true,
                success: function (result) {
                    if(result.code==0){
                        _this.selectedTags=[];
                        var t=[];
                        for(var i=0;i<result.data.length;i++){
                            t.push(result.data[i].alia);
                            _this.selectedTags.push({ name: result.data[i].alia, type: '' })
                        }
                        _this.submitForm.articleTags=t;
                    }
                },
                error: function (data) {}
            });
        }
        /**
         * 将以base64的图片url数据转换为Blob
         * @param urlData
         *            用url方式表示的base64图片数据
         */
         convertBase64UrlToBlob=function(urlData){
            var bytes=window.atob(urlData.split(',')[1]);        //去掉url的头，并转换为byte
            //处理异常,将ascii码小于0的转换为大于0
            var ab = new ArrayBuffer(bytes.length);
            var ia = new Uint8Array(ab);
            for (var i = 0; i < bytes.length; i++) {
                ia[i] = bytes.charCodeAt(i);
            }

            return new Blob( [ab] , {type : 'image/png'});
        }
        var initMarkdowm=function(){
			var _this = this
			testEditor = editormd("test-editormd", {
                width: "100%",
                //autoHeight: true,//自动高度
                height: document.body.clientHeight-60,
                path : '/editor/lib/',
                //theme : "dark",
                //previewTheme : "dark",
                //editorTheme : "pastel-on-dark",
                markdown : _this.submitForm.content,
                codeFold : true,
                //syncScrolling : false,
                saveHTMLToTextarea : true,    // 保存 HTML 到 Textarea
                searchReplace : true,
                //watch : false,                // 关闭实时预览
                htmlDecode : "style,script,iframe|on*",            // 开启 HTML 标签解析，为了安全性，默认不开启    
                //toolbar  : false,             //关闭工具栏
                //previewCodeHighlight : false, // 关闭预览 HTML 的代码块高亮，默认开启
                emoji : true,
                taskList : true,
                tocm  : true,         // Using [TOCM]
                tex : true,                   // 开启科学公式TeX语言支持，默认关闭
                flowChart : true,             // 开启流程图支持，默认关闭
                sequenceDiagram : true,       // 开启时序/序列图支持，默认关闭,
                //dialogLockScreen : false,   // 设置弹出层对话框不锁屏，全局通用，默认为true
                //dialogShowMask : false,     // 设置弹出层对话框显示透明遮罩层，全局通用，默认为true
                //dialogDraggable : false,    // 设置弹出层对话框不可拖动，全局通用，默认为true
                //dialogMaskOpacity : 0.4,    // 设置透明遮罩层的透明度，全局通用，默认值为0.1
                //dialogMaskBgColor : "#000", // 设置透明遮罩层的背景颜色，全局通用，默认为#fff
                imageUpload : true,
                imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
                imageUploadURL : "/qiniu/editormdupload",
                onload : function() {
                    this.editor.on("paste", function(){//图片截图黏贴
                        console.clear();
                        var items = (event.clipboardData || event.originalEvent.clipboardData).items;
                        for (var index in items) {
                            var item = items[index];
                            if (item.kind === 'file') {
                                var blob = item.getAsFile();
                                var reader = new FileReader();
                                // data url!
                                reader.readAsDataURL(blob);
                                reader.onload = function (event) {
                                    var base64 = event.target.result;
                                    var file=_this.convertBase64UrlToBlob(base64);
                                    var form = new FormData();
                                    // 文件对象
                                    form.append("file", file);
                                    $.ajax({
                                        data: form,
                                        type: "POST",
                                        url: '/qiniu/upload',
                                        processData:false,
                                        cache: false,//上传文件无需缓存
                                        processData: false,//用于对data参数进行序列化处理 这里必须false
                                        contentType: false, //必须
                                        success: function (res) {
                                            if(res.success==1){
                                                //新一行的图片显示
                                                testEditor.insertValue("\n![](" + res.results[0].url + ")");
                                            }
                                        },
                                        error: function (data) {

                                        }
                                    });
                                };
                            }
                        }
                    });
                   /* $('#test-editormd').on("paste", function(){
                        console.clear();
                        console.log("on() => Override settings.onpreviewscroll =>", this, this.id, event, (new Date).getTime());
                    });*/
                    //this.fullscreen();
                    //this.unwatch();
                    //this.watch().fullscreen();

                    //this.setMarkdown("#PHP");
                    //this.width("100%");
                    //this.height(480);
                    //this.resize("100%", 640);
                }
            });

		}
	 var app = new Vue({
         el: '#app',
         data:{
             coverImageActive:'first',
             netimageurl:'',
        	 submitForm:{
	  			  status: '0',
	  			  title: '', // 文章题目
	  			  author:'',
	  			  categoryId:0,
	  			  categoryName:'',
	  			  content: '', // 文章内容
	  			  abstractContent: '', // 文章摘要
	  			  coverImageList: [], // 文章图片
	  			  publishTime: undefined, // 前台展示时间
	  			  showStyle:0,
	  			  articleType:0,
	  			  id: 0,
	  			  isRecommend:0,
	  			  openComment: 0,//打开评论
	  			  articleTags: [],
	  			},
	  			treeProps:{
	  				label: 'name',
	  				children:'children',
	  				isLeaf: 'isLeaf'
	  			},
	  		  saveoptionshow:false,
	  		  dialogVisible:false,
	  		  dialogImageUrl:'',
	  		  categoryOptions:[],
	  		  defaultTag:'',
	  		  tagList: [],
	  		  selectedTags:[],
	  		  parentId:0,
	  		  tinymceId:'tinymceId',
      		  active: false,
      		  position: '',
      		  currentTop: '',
      		  stickyTop:0,
      		  zIndex:20,
      		  width: undefined,
      		  height: undefined,
      		  child: null,
      		  stickyHeight: 0,
   			  fetchSuccess: true,
   		      loading: false,
   		      userLIstOptions: [],
   		      rules: {},
   		      hasChange: false,
  	      	  hasInit: false,
  	      	  limit:3,
  	      	  showfileList:false,
  	      	  headers:{}
 
   	    },
   	 watch: {
   	   
   	  },
   	 mounted() {
   		 var token = $("meta[name='_csrf']").attr("content");
 		 var header = $("meta[name='_csrf_header']").attr("content");
		 var str= '{ "'+header+'": "'+token+'"}'; 
		 this.headers = eval('(' + str + ')');
   	     this.height = this.$el.getBoundingClientRect().height;
   	     //window.addEventListener('scroll', this.handleScroll,true);
	   	  this.$nextTick(function () {
	   		this.initMarkdowm();
	   	  })
	   	 this.loadAllTagList();
   	   },
   	   activated() {
   	     //this.handleScroll();
   	     this.initMarkdowm();

   	   },
   	   destroyed() {
   	     //window.removeEventListener('scroll', this.handleScroll);
   	   },
   	computed: {
   	    contentShortLength() {
   	      return this.submitForm.abstractContent.length
   	    }
   	  },
   	  created() {
   		 this.initArticleModel();
   		 this.loadCategoryOptions();
   	  },
 	 methods: {
         initArticleTags:initArticleTags,
         addnetimage(){
             if(this.netimageurl!=''){
                 this.submitForm.coverImageList.push(this.netimageurl);
                 this.netimageurl="";
			 }
		 },
 		btnsaveoption(){
 			this.saveoptionshow=!this.saveoptionshow;
 		},
 		opencommentChange(data){
 			this.submitForm.openComment=data;
 		},
 		articleTypeChange(data){
 			this.submitForm.articleType=data;
 		},
 		isRecommendChange(data){
 			this.submitForm.isRecommend=data;
 		},
 		loadCategoryOptions:loadCategoryOptions,
 		initArticleModel:initArticleModel,
 		submitArticle:submitArticle,
 		initMarkdowm:initMarkdowm,
		convertBase64UrlToBlob:convertBase64UrlToBlob,
	    handleScroll() {
	      this.width = this.$el.getBoundingClientRect().width;
	      var offsetTop = this.$el.getBoundingClientRect().top;
	      if (offsetTop <= this.stickyTop) {
	        this.sticky()
	        return
	      }
	    },
	    returnArticle:returnArticle,
	    loadNode:loadNode,
	    cateCheckChange(data){
	    	this.submitForm.categoryId=data;
	    },
	    querySearch(queryString, cb) {
	    	//debugger;
	        var tagList = this.tagList;
	        var results = queryString ? tagList.filter(this.createFilter(queryString)) : tagList;
	        // 调用 callback 返回建议列表的数据
	        cb(results);
	      },
	      createFilter(queryString) {
	        return (tag) => {
	          return (tag.value.toLowerCase().indexOf(queryString.toLowerCase()) === 0);
	        };
	      },
	      loadAllTagList:loadAllTagList,
	      selectTag(item) {
	    	  if (JSON.stringify(this.selectedTags).toLowerCase().indexOf(item.value.trim().toLowerCase())==-1 )  {
	    		  this.selectedTags.push({ name: item.value, type: '' });
	    		  if(this.submitForm.articleTags==''){
	    			  this.submitForm.articleTags=item.value;
	    		  }else{
	    			  this.submitForm.articleTags+=","+item.value;
	    		  }
	    		}
	          this.defaultTag='';
	        },
	      removeTag(tag) {
	        	this.selectedTags.splice(this.selectedTags.indexOf(tag), 1);
	        	var tags=[];
				for(var i=0;i<this.selectedTags.length;i++){
					tags.push(this.selectedTags[i].name);
				}
				this.submitForm.articleTags=tags.join(",");
	      },
	      addTag(){
	    	  var value=this.defaultTag.trim();
	    	  if (JSON.stringify(this.selectedTags).toLowerCase().indexOf(value.toLowerCase())==-1 )  {
	    		  this.selectedTags.push({ name: value, type: '' });
	    		  if(this.submitForm.articleTags==''){
	    			  this.submitForm.articleTags=value;
	    		  }else{
	    			  this.submitForm.articleTags+=","+value;
	    		  }
	    		  
	    		}
              this.defaultTag='';
	      },
	      myupload(param){
	    	  var form = new FormData();
	    	  // 文件对象
	    	  form.append("file", param.file);
	    	  $.ajax({
			        data: form,
			        type: "POST",
			        url: '/qiniu/upload',
			        processData:false,
			        cache: false,//上传文件无需缓存
                    processData: false,//用于对data参数进行序列化处理 这里必须false
                    contentType: false, //必须
			        success: function (res) {
			        	if(res.success==1){
				    		  for(var i=0;i<res.results.count;i++){
				    			  app.submitForm.coverImageList.push(res.results[i].url);
				    		  }
							}else{
								app.$message.error(res.msg);
							}
			        },
			        error: function (data) {
			        	
			        }
			    });
	    	   
	      },
	      uploadCoverImage(res, file) {
	    	  if(res.success==1){
	    		  for(var i=0;i<res.results.length;i++){
	    			  this.submitForm.coverImageList.push(res.results[i].url); 
	    		  }
				}else{
					this.$message.error(res.msg);
				}
	    	  //this.$refs.upload.clearFiles();  //清空上次文件
	        },
	        validCoverImageUpload(file) {
	        	debugger;
	        	if(this.submitForm.coverImageList&&this.submitForm.coverImageList.length>=3){
	        		this.$message.error('封面图片最多三张!');
	        		return false;
	        	}
	          var isLt2M = file.size / 1024 / 1024 < 2;
	          if (file.type !== 'image/jpeg'&&file.type !== 'image/jpg'&&file.type !== 'image/gif'&&file.type !== 'image/png') {
	            this.$message.error('上传头像图片只能是 JPG 格式!');
	          }
	          if (!isLt2M) {
	            this.$message.error('上传头像图片大小不能超过 2MB!');
	          }
	          return isLt2M;
	        },
	        handleRemove(url) {
	        	this.submitForm.coverImageList.splice(this.submitForm.coverImageList.indexOf(url), 1);
            },
            handlePictureCardPreview(url) {
            	//debugger;
	            this.dialogImageUrl =url ;
	            this.dialogVisible = true;
          }
 	  }});
	 </script>
	</div>
</body>
</html>